<template>
	<view class="page">
		<view class="order" v-for="one in list" :key="one">
			<view class="line-1">
				<text>订单号：{{one.code}}</text>
				<text>{{one.status}}</text>
			</view>
			<view class="line-2">
				<text>假设这里是商品简要信息</text>
			</view>
			<view class="line-3">
				<text>金额：{{one.amount}}元</text>
				<button class="pay-btn" type="primary" v-if="one.status=='未付款'" @tap="pay(one.id)">付款</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[],
				token:"eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzUxMiJ9.eyJzdWIiOiIzIiwiaWF0IjoxNTkzMzQ5NzUyLCJleHAiOjE1OTM5NTQ1NTJ9.JlkqA-j498RE3m7rwVxQTcTsxAAhNA44jVU1G1P4wHgcBxWtKYx-P6IMdqyKZk-Bn3ktDKf9spQLXQYgD4O6mA"
			}
		},
		methods: {
			pay:function(id){
				let that = this
				//运行平台的名字
				let platform = uni.getSystemInfoSync().platform
				if(platform=='android'){
					/* 如果是在安卓上运行 */
					uni.request({
						url:that.url.zfb.appPayOrder,
						method:"POST",
						header:{
							"token":uni.getStorageSync("token")
						},
						data:{
							"orderId":id
						},
						success:function(resp){
							let orderString = resp.data.orderString
							
							/*  调用沙箱插件唤醒沙箱App进行付款 */
							
							// 获取jyAlipay对象
							const jyAliPay = uni.requireNativePlugin('JY-ALIPAY')
							jyAliPay.show({ // 发起支付
							    if_sanbox:true, 
							    auto_create_order_info:false,
							    appid:that.zfb.app.appid,
							    rsa2_private:that.zfb.app.privateKey,
							    order_info:orderString,
							}, function (result) { // 支付完成回调
							    // console.log(result)
							     if(result.resultStatus == '9000'){
							         uni.showToast({
										 title:"支付成功"
									 })
									 uni.request({
										 url:that.url.zfb.updateOrderStatus,
										 method:"POST",
										 header:{
											 "token":uni.getStorageSync("token")
										 },
										 data:{
											 "orderId":id
										 },
										 success:function(resp){
											 that.loadData()
										 }
									 })
									 
							     }else{
							         uni.showToast({
							         	title:"付款失败",
										icon:"none"
							         })
							     } 
							});
						}
					})
					
				}else{
					/* 如果是在小程序上运行 */
					uni.getProvider({
						service:"payment",
						success:function(resp){
							let provider = resp.provider[0]
							if(provider == 'wxpay'){
								/* 微信小程序 */
								uni.request({
									url:that.url.wx.microAppPayOrder,
									method:"POST",
									header:{
										"token": uni.getStorageSync("token")
									},
									data:{
										"orderId":id
									},
									success:function(resp){
										// console.log(resp)
										let data = resp.data
										console.log("data========",data)
										
										let timeStamp = data.timeStamp
										let nonceStr = data.nonceStr
										let pk = data.package
										let paySign = data.paySign
										
										uni.requestPayment({
											"timeStamp":timeStamp,
											"nonceStr":nonceStr,
											"package": pk,
											"signType": "MD5",
											"paySign": paySign,
											success:function(){
												uni.showToast({
													title:"支付成功"
												})	
												uni.request({
													url: that.url.wx.updateOrderStatus,
													method: "POST",
													header:{
														"token":uni.getStorageSync("token")
													},
													data:{
														"orderId":id
													},
													success:function(resp){
														let pages = getCurrentPages()
														let page = pages[pages.length-1]
														page.onShow()
													},
													fail:function(){
														console.log("更新订单状态失败")
													}
												})
											},
											fail:function(){
												uni.showToast({
													title:"支付失败"
												})
											}
										})
									}
								})
							}else if(provider=='alipay'){
								/* 支付宝小程序 */
								uni.request({
									url:that.url.zfb.microAppPayOrder,
									method:"POST",
									header:{
										// "token": uni.getStorageSync("token")
										"token": that.token
									},
									data:{
										"orderId":id
									},
									success:function(resp){
										// console.log(resp)
										let prepayId = resp.data.prepayId 
										uni.requestPayment({
											provider:"alipay",
											orderInfo:prepayId,
											success:function(resp){
												//支付成功resultCode返回9000
												if(resp.resultCode == 9000){
													uni.showToast({
														title:"支付成功"
													});
													
													uni.request({
														url: that.url.zfb.updateOrderStatus,
														method: "POST",
														header:{
															// "token":uni.getStorageSync("token")
															"token": that.token
														},
														data:{
															"orderId":id
														},
														success:function(resp){
															let pages = getCurrentPages()
															let page = pages[pages.length-1]
															page.onShow()
														},
														fail:function(){
															console.log("更新订单状态失败")
														}
													})
												}	
											}
										})
									},
								})	
							}
						}
					})
				}
					
			},
			loadData:function(){//重新加载数据
				let that = this
				uni.request({
					url:that.url.searchUserOrderList,
					method:"POST",
					header:{
						"token":uni.getStorageSync("token")
						// "token": that.token	
					},
					data:{
						"page": 1,
						"length": 20
					},
					success:function(resp){
						console.log(resp)
						let list = resp.data.list
						for(let one of list){
							let status = one.status
							if(status==1){
								one.status = "未付款"
							}else if(status==2){
								one.status = "已付款"
							}else if(status==3){
								one.status = "已发货"
							}else if(status==4){
								one.status = "已签收"
							}
							//简略订单流水号
							one.code=one.code.substr(0,16)+"……"
						}
						that.list = list
					}
				})
			}
		},
		onShow:function(){
			this.loadData()
		}
	}
</script>

<style>
	.page{
		padding: 10px;
	}
	.order{
		padding: 10px;
		border-bottom: solid 1px #e0e0e0;
		font-size: 16px;
	}
	.line-1{
		display: flex;
		justify-content: space-between;
		padding-bottom: 5px;
	}
	.line-2{
		padding-bottom: 5px;
	}
	.line-3{
		display: flex;
		justify-content: space-between;
		align-items: baseline;
	}
	.pay-btn{
		 margin: 0;
		 font-size: 14px;
		 min-width: 80px;
		 line-height: 35px;
		 height:35px;
		 border:none;
	}
</style>
